<template>
  <table>
    <tr>
      <th>ID</th>
      <th>Name</th>
      <th>Sex</th>
    </tr>
    <tr v-for="(userinfo,index) in userinfos" :key="userinfo.id">
      <td>{{userinfo.id}}</td>
      <td>{{userinfo.name}}</td>
      <td>{{userinfo.sex}}</td>
    </tr>
  </table>

  <button @click="setUserinfo">获取数据</button>
</template>

<script>
export default {
  beforeCreate() {
    console.log("beforeCreate")
  },
  created() {
    console.log("created")
    this.userinfos = [{"id": 1,"name":"卢高雅","sex":"女"},{"id": 2,"name":"张三","sex":"女"},{"id": 3,"name":"李四","sex":"男"}];
  },
  beforeMount() {
    console.log("beforeMount")
  },
  mounted(){
    console.log("mounted")
  },
  beforeUpdate(){
    console.log("beforeUpdate")
  },
  updated(){
    console.log("updated")
  },
  beforeUnmount(){
    console.log("beforeUnmount")
  },
  unmounted(){
    console.log("unmounted")
  },
  data(){
    return {
      userinfos:[]
    }
  },
  methods:{
    setUserinfo(){
      //this.userinfos =
    }
  }
}
</script>

<style scoped>

</style>